<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>学生-选课</title>
	<script src="resources/js/public/jquery-3.3.1.min.js"></script>
	<script src="resources/layui/layui.js"></script>
	<script src="resources/js/public/vue.min.js"></script>

	<script src="resources/js/public/public.js"></script>
	<script src="resources/js/student/myAllCourse.js"></script>

	<link rel="stylesheet" href="resources/layui/css/layui.css">
	<link href="resources/css/public.css" rel="stylesheet" type="text/css"/>
	<style>
		.t{
			margin-top: 15px;
		}
		.w1{
			width: 100px;
		}
	</style>
</head>
<body>
	<div id="header">
		<#include "/WEB-INF/page/student/header.html">
	</div>
	<div class="layui-fluid">
		<form class="layui-form">
			<div class="layui-form-item  layui-inline t">
				<input type="text" class="layui-input" id="name" placeholder="课程名称" />
			</div>
			<div class="layui-form-item  layui-inline t">
				<input type="text" class="layui-input" id="major" placeholder="所属专业"/>
			</div>

			<div class="layui-form-item  layui-inline t">
				<input type="text" class="layui-input" id="teacherName" placeholder="授课教师名字"/>
			</div>
			<button type="button" id="queryCourse" class="layui-btn">搜索</button>
		</form>
		<hr class="layui-bg-green"/>
		<table  class="layui-table layui-form" lay-skin="row">
			<colgroup>
				<col width="80px">
				<col width="120px">
				<col width="140px">
				<col width="100px">
				<col width="60px">
				<col width="80px">
				<col width="100px">
				<col width="100px">
				<col width="200px">
				<col width="100px">
				<col width="100px">
				<col width="100px">
				<col width="100px">
			</colgroup>
			<thead>
				<tr>
					<th>课程ID</th>
					<th>课程名称</th>
					<th>学院</th>
					<th>所属专业</th>
					<th>属性</th>
					<th>学分</th>
					<th>授课教师</th>
					<th>开放状态</th>
					<th>时间地点</th>
					<th>限制人数</th>
					<th>已选人数</th>
					<th>周期</th>
					<th>选择</th>
				</tr>
			</thead>
			<tbody  id="vue_content">
				<tr v-for="c in list">
					<td class="id" v-text="c.id"></td>
					<td v-text="c.name"></td>
					<td v-text="c.college"></td>
					<td v-text="c.major"></td>
					<td v-text="c.property"></td>
					<td v-text="c.credit"></td>
					<td v-text="c.teacherName"></td>
					<td class="state" mark="open" v-if="c.state==='true'">
						<strong style="color:green">开放</strong>
					</td>
					<td class="state" mark="close" v-else-if="c.state==='false'">
						<strong style="color:red">关闭</strong>
					</td>
					<td>
						<span v-for="t in c.trinityList">
							<span v-text="t.week"></span>&nbsp;&nbsp;
							<span v-text="t.time"></span>&nbsp;&nbsp;
							<span v-text="t.place"></span>
							<br>
						</span>
					</td>
					<td v-text="c.restrictedNum"></td>
					<td v-text="c.selectedNum"></td>
					<td v-text="c.cycle"></td>
					<td>
						<button type="button" class="layui-btn choseCourse">选择</button>
					</td>
				</tr>
			</tbody>
		</table>
		<nav style="text-align: center">
			<div id="page_container"></div>
		</nav>
	</div>
</body>
</html>